/** * @description: 全校维度-班级，学生维度-五困生列表 */
<template>
  <div class="pub-container classes-Msg">
    <!-- 搜索 -->
    <Search ref="Search" placeholderText="学生学号/姓名" />

    <!-- 学生内容 -->
    <div class="floor">
      <p class="floor-title">学生信息</p>
      <van-pull-refresh v-model="refreshing" @refresh="onRefresh" :disabled="finished">
        <van-list v-model="loading" :finished="finished" finished-text="没有更多了..." @load="onLoad">
          <FiveHardStudent :classList="classList" />
        </van-list>
      </van-pull-refresh>
    </div>
  </div>
</template>

<script>
import Search from '@/components/Search/index'
import FiveHardStudent from '@/components/fiveHardStudent'
import { difficultStuInfo } from '@/api/fiveHard'
export default {
  name: 'classesListMsg',
  components: { Search, FiveHardStudent },
  data() {
    return {
      classList: [],
      loading: true,
      finished: false,
      refreshing: false,
      params: {
        collegeId: undefined,
        classId: undefined,
        pageNum: 1,
        pageSize: 10,
      },
    }
  },
  created() {
    this.params.collegeId = this.$route.query.collegeId
    this.params.classId = this.$route.query.classId
    this.getDifficultStuInfo()
  },
  methods: {
    async getDifficultStuInfo(isRefresh) {
      try {
        const { data } = await difficultStuInfo({
          ...this.params,
        })

        if (isRefresh) {
          this.classList = [...data.data.list, ...this.classList]
          this.refreshing = false
        } else {
          this.classList = [...this.classList, ...data.data.list]
          this.loading = false
        }
        if (data.data.list.length === 0) {
          this.finished = true
        }
      } catch (e) {
        console.log(e)
      }
    },
    // 上拉加载处理函数
    onLoad() {
      this.params.pageNum++

      this.getDifficultStuInfo()
    },
    // 下拉刷新处理函数
    onRefresh() {
      this.params.pageNum++
      this.getDifficultStuInfo(true)
    },

    //学生详情页面已画，暂不进行开发（无接口，后期开发）
    // skipNextDetail() {
    //    this.$router.push('/fiveHardDetail')
    // },
  },
}
</script>

<style lang="scss" scoped>
.floor {
  background: $bg-white;
  padding: 20px 12px;
  border-radius: 10px;
  margin-top: 12px;
  &-title {
    font-size: $fz16;
    color: $color-title;
    margin-bottom: 25px;
  }
}
::v-deep {
  .van-search__content {
    background: #f5f5f5;
  }
}
</style>
